<template>
    <div>
        <el-dialog title="查看客户" :visible.sync="dialogFormVisible" width="30%" style="text-align: left">
            <table style="font-weight: bold">
                <tr>
                    <td><label for="label_11">姓名: <span style="color: red">*</span></label></td>
                    <td>
                        <el-input
                            type="input"
                            placeholder="请输入内容"
                            v-model="name"
                            id="label_11"
                            style="width: 250px"
                            :disabled="true"
                        >
                        </el-input>
                    </td>
                </tr>
                <tr>
                    <td><label for="label_12">年龄:</label></td>
                    <td>
                        <el-input
                            type="input"
                            placeholder="请输入内容"
                            v-model="age"
                            id="label_12"
                            style="width: 250px"
                            :disabled="true"
                        >
                        </el-input>
                    </td>
                </tr>
                <tr>
                    <td><label for="label_13">家庭住址:</label></td>
                    <td>
                        <el-input
                            type="input"
                            placeholder="请输入内容"
                            v-model="addr"
                            id="label_13"
                            style="width: 250px"
                            :disabled="true"
                        >
                        </el-input>
                    </td>
                </tr>
                <tr>
                    <td><label for="label_17">爱好:</label></td>
                    <td>
                        <el-input
                            type="input"
                            placeholder="请输入内容"
                            v-model="hobby"
                            id="label_17"
                            style="width: 250px"
                            :disabled="true"
                        >
                        </el-input>
                    </td>
                </tr>
                <tr>
                    <td><label for="label_14">联系方式: <span style="color: red">*</span></label></td>
                    <td>
                        <el-input
                            type="input"
                            placeholder="请输入内容"
                            v-model="phone"
                            id="label_14"
                            style="width: 250px"
                            :disabled="true"
                        >
                        </el-input>
                    </td>
                </tr>
                <tr>
                    <td><label for="label_18">客户来源: </label></td>
                    <td>
                        <el-select v-model="come" placeholder="请选择" id="label_18">
                            <el-option
                                v-for="item in come_options"
                                :key="item.value"
                                :value="item.value"
                                :label="item.label"
                                style="width: 250px"
                                :disabled="true"
                            >
                            </el-option>
                        </el-select>
                    </td>
                </tr>
                <tr>
                    <td><label for="label_20">分配给: <span style="color: red">*</span></label></td>
                    <td>
                        <el-select v-model="desginer" placeholder="请选择" id="label_20">
                            <el-option
                                v-for="item in desginer_options"
                                :key="item.id"
                                :value="item.id"
                                :label="item.name"
                                style="width: 250px"
                            >
                            </el-option>
                        </el-select>
                    </td>
                </tr>
            </table>
        </el-dialog>
    </div>
</template>

<script>
    export default {
        name: "LookCustomer",
        data() {
            return {
                dialogFormVisible: false,
                customerId: 0,
                name: "",
                age: "",
                addr: "",
                phone: "",
                hobby: "",  // 默认员工
                come: "",  // 客户来源
                come_options: [
                    {value: "1", label: "自然进店"},
                    {value: "2", label: "网络来源"},
                    {value: "3", label: "业务员来源"}
                ],
                desginer: "",
                desginer_options: []
            };
        },
        methods: {
            handleOpen(rowData) {
                console.log(rowData)
                this.dialogFormVisible = true;
                this.customerId = rowData.id;
                this.name = rowData.name;
                this.age = rowData.age;
                this.addr = rowData.addr;
                this.phone = rowData.phone;
                this.hobby = rowData.hobby;
                this.come = rowData.come;
                // 获取设计师的名字
                this.handleGetDesginer(rowData.user_id);

            },
            handleGetDesginer(uid="") {
                if (uid === "") {
                    this.AXIOS.get("/api/user/getDesginer")
                        .then(resp => {
                            console.log(resp)
                            let statusCode = resp.data.status;
                            if (statusCode === 1) {
                                this.desginer_options = resp.data.data;
                            } else {
                                this.$message({type: "error", message: "加载数据失败"})
                            }
                        })
                        .catch(err => {
                            this.$message({type: "error", message: err})
                        })
                } else {
                    this.AXIOS.get(`/api/user/getDesginer?uid=${uid}`)
                        .then(resp => {
                            console.log(resp)
                            let statusCode = resp.data.status;
                            if (statusCode === 1) {
                                this.desginer = resp.data.data;
                            } else {
                                this.$message({type: "error", message: "加载数据失败"})
                            }
                        })
                        .catch(err => {
                            this.$message({type: "error", message: err})
                        })
                }
            }
        },
    };
</script>

<style scoped>
</style>
